<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>享动</title>
    <script src="js/mui.min.js"></script> 
    <script type="text/javascript" src="js/jquery-2.1.0.js" ></script>
    <link href="css/mui.min.css" rel="stylesheet"/>
    <link href="mycss/homestyle.css" rel="stylesheet"/>
    <link href="mycss/titlebar.css" rel="stylesheet"/>
    <link href="mycss/myfont.css" rel="stylesheet"/>
    <style>
		html,body {
			background-color: #efeff4;
		}
		.tbar,.tbar2{
			width:100%;
			background-color: #F0AD4E;
			height:40px;				
			z-index: 100;
			position: fixed;
			top:45px;
		}
		.tbar li,.tbar2 li{
			width:50%;
			height: 40px;
			list-style: none;
			float: left;
			text-align: center;
			padding-top: 8px;
			color: #fff;
		}
		.tbar2 li{
			width:33.3%;
		}
		.tbar li a,.tbar2 li a{
			color:#fff;
			font-size: 18px;
		}
		/*根据实际需求在父页面给mui-content设置top属性
		*可以解决修改下拉刷新子页面默认top值后,下拉刷新提示框位置异常问题*/
		.mui-bar-nav ~ .mui-content .mui-pull-top-pocket{
			top: 85px !important;
		}
	</style>
</head>
<body>
	<header id="header" class="mui-bar mui-bar-nav">
	    <!--a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a-->
	    <h1 id="title" class="mui-title" style="display: none;">享动</h1>
	    <div id="top-tab" class="mui-segmented-control">
			<span class="mui-control-item mui-active">PK</span>
			<span class="mui-control-item">PLAY</span>
		</div>
		<!--a id="top-popover" class="mui-icon mui-icon-bars mui-pull-right"></a-->
	</header>
	<div class="mui-bar mui-bar-tab">
	<span id="defaultTab" class="mui-tab-item mui-active2" href="subpages/fight-pk.html">
		<span class="mui-icon iconfont icon-paperplane"></span>
		<span class="mui-tab-label">约</span>
	</span>
	<span class="mui-tab-item" href="subpages/found.html">
		<span class="mui-icon iconfont icon-search"></span>
		<span class="mui-tab-label">发现</span>
	</span>
	<span class="mui-tab-item" href="" align="center">
		<span id="iconPlus" class="icon-mid" style="width: 40px;height: 40px;display: inline-block;">
			<img style="width: 100%;height: 100%;" src="img/plus.png">
		</span>
	</span>
	<span class="mui-tab-item" href="subpages/contact.html">
		<span class="mui-icon iconfont icon-camera"></span>
		<span class="mui-tab-label">运动圈</span>
	</span>
	<span class="mui-tab-item" href="subpages/setting.html">
		<span class="mui-icon iconfont icon-user1"></span>
		<span class="mui-tab-label">我</span>
	</span>
	</div>
	<div id="tbar1" class="tbar">
		<li id="spt" style="border-right: 1px solid #fff;">
			运动种类<span class="mui-icon mui-icon-arrowdown"></span>
		</li>
		<li id="sta">
			比赛状态<span class="mui-icon mui-icon-arrowdown"></span>
		</li>
	</div>
	<div class="tbar2" id="tbar2" style="display: none;">
		<li id="#item1" class="active" style="border-right: 1px solid #fff;color: #338208;">
			广场
		</li>
		<li id="#item2" style="border-right: 1px solid #fff;">
			关注
		</li>
		<li id="#item3">
			热门
		</li>
	</div>
	<div class="mui-content">
	</div>
	<script type="text/javascript" src="myjs/getServerAdress.js"></script>
	<script type="text/javascript" src="myjs/app.js"></script>
	<script type="text/javascript" src="myjs/loadAnim.js"></script>
	<script type="text/javascript" src="myjs/btmbar.js"></script>
	<script>
			mui.init({
				swipeBack:true //启用右滑关闭功能
			});
			(function($, doc) {
				var backButtonPress = 0;
				$.back = function(event) {
					backButtonPress++;
					if(backButtonPress > 1) {
						plus.runtime.quit();
					} else {
						plus.nativeUI.toast('再按一次退出应用');
					}
					setTimeout(function() {
						backButtonPress = 0;
					}, 1000);
					return false;
				};
			}(mui, document));
	</script>
</body>
</html>